<template>
  <super-table
    :pagination=pagination
    :pageSize="50"
    :scroll="{ x: 1100}"
    ref="ref_consumptionDetails"
    ls_props_columns="consumptionDetails"
    :rowKey="(record,index)=> index"
    :columns="consumptionDetailColumns"
    :data="loadConsumptionDetailsData"
  >
    <!--序号-->
    <template slot="index" slot-scope="text,record,index">
      <span>{{index+1}}</span>
    </template>
  </super-table>
</template>

<script>
import {SuperTable} from '@/components'

import { getConsumptionDetailById } from '@/api/customer/customer'

export default {
  name: 'TabConsumptionDetail',
  props:{
    customerId:{
      type:String,
      default:''
    },
  },
  components:{
    SuperTable
  },
  data(){
    return{
      //封装的超级表格数据，需要返回一个promise，可见src/components/table组件
      loadConsumptionDetailsData: parameter => {
        return getConsumptionDetailById(this.customerId).then(res => {
          // console.log('消费明细',res)
          return res
        })
      },
      //消费明细表列结构
      consumptionDetailColumns: [
        { title: '序号',scopedSlots: { customRender: 'index' }, width:60,fixed:'left'},
        { title: '项目名称',dataIndex: 'itemName', key: 'itemName',width:150,ellipsis: true},
        { title: '业绩科室',dataIndex: 'deptName', key: 'deptName',width:120},
        { title: '成交日期',dataIndex: 'chargeDate', key: 'chargeDate',
          defaultSortOrder: 'descend',
          sorter: (a, b) => a.chargeDate - b.chargeDate,
          width:120
        },
        { title: '价格',dataIndex: 'itemPrice', key: 'itemPrice',width:80},
        { title: '折扣',dataIndex: 'discount', key: 'discount',width:80},
        { title: '成交金额',dataIndex: 'chargeAmt', key: 'chargeAmt',width:80},
        { title: '应付金额',dataIndex: 'payableAmt', key: 'payableAmt',width:80},
        { title: '营收金额',dataIndex: 'revenueAmt', key: 'revenueAmt',width:80},
        { title: '实收金额',dataIndex: 'realResultAmt', key: 'realResultAmt',width:80},
        { title: '赠送金额',dataIndex: 'rpAmtGold', key: 'rpAmtGold',width:80},
        { title: '现金',dataIndex: 'xj', key: 'xj',width:80},
        { title: '刷卡',dataIndex: 'sk', key: 'sk',width:80},
        { title: '转账',dataIndex: 'zz', key: 'zz',width:80},
        { title: '预存抵扣',dataIndex: 'prestore', key: 'prestore',width:80},
        { title: '押金抵扣',dataIndex: 'yj', key: 'yj',width:80},
        { title: '增值金抵扣',dataIndex: 'gold', key: 'gold',width:100},
        { title: '积分抵扣',dataIndex: 'jf', key: 'jf',width:80},
        { title: '消费券抵扣',dataIndex: 'ticket', key: 'ticket',width:100},
        { title: '活动名称',dataIndex: 'activityName', key: 'activityName',width:120,ellipsis: true},
        { title: '套餐名称',dataIndex: 'packageName', key: 'packageName',width:120},
        { title: '摘要',dataIndex: 'adstract', key: 'adstract',width:120,ellipsis: true},
        { title: '备注',dataIndex: 'remark', key: 'remark',width:120},
      ],
      pagination: {
        pageSizeOptions: ['50', '100', '150','200'], //这里注意只能是字符串，不能是数字
      },
    }
  },
  activated() {
    if(this.$store.state.app.multiTab){
      // console.log('这里是激活缓存',this.$store.state.app)
      this.$nextTick(()=>{
        this.$refs.ref_consumptionDetails && this.$refs.ref_consumptionDetails.refresh()
      })
    }
  },
  watch:{
     $route(){
        if(this.$route.query.id && this.$route.query.card_no){
         this.customerId = this.$route.query.id
         this.card_no = this.$route.query.card_no
         this.$refs.ref_consumptionDetails && this.$refs.ref_consumptionDetails.refresh()
        }
    },
  }
}
</script>

<style scoped>

</style>